<!DOCTYPE html>
<html>
<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
		<title>AIpark运维管理</title>
		<meta name="keywords" content="AIpark运维管理系统">
		<meta name="description" content="AIpark运维管理系统">
		<link href="../static/css/bootstrap.min.css" rel="stylesheet">
		<link href="../static/css/font-awesome.css?v=4.4.0" rel="stylesheet">
		<link href="../static/css/animate.css" rel="stylesheet">
		<link href="../static/css/style.css" rel="stylesheet">
		<link href="../static/css/login.css" rel="stylesheet">
		<!--[if lt IE 9]>
    <meta http-equiv="refresh" content="0;ie.html"/>
    <![endif]-->
		<script>
			if(window.top !== window.self) {
				window.top.location = window.location;
			}
		</script>
	</head>

	<body class="signin">
		<div class="signinpanel">
			<div class="row">

				<div class="col-sm-5" style="width:100%">
					<form id="signupForm">
						<h3 class="text-center">用户登录</h3>
						<p class="m-t-md text-center">欢迎登录AIpark运维管理系统</p>
						<input type="text" name="username" id="username" class="form-control uname" value="admin" />
						<input type="password" id="password" name="password" class="form-control pword m-b" value="111111" />
						<a id="login" class="btn btn-login btn-block">登录</a>
						<!--按钮模块-->
						<!--占时不需要-->
						<!--<div class="outside-login">
                    <div class="outside-login-tit">
                        <span>代码链接</span>
                    </div>
                    <div class="outside-login-cot">
                        <a class="outside-login-btn wxoa actived oschina J-btnSwitchLoginType" target="_Blank"
                           href="https://www.oschina.net/p/bootdo">
                            <em><i class="fa fa-home"></i></em>
                            <span>oschina主页</span>
                        </a>
                        <a class="outside-login-btn wxoa actived my J-btnSwitchLoginType" target="_Blank"
                           href="https://gitee.com/lcg0124/bootdo">
                            <em><i class="fa fa-git-square"></i></em>
                            <span>码云仓库</span>
                        </a>
                        <a class="outside-login-btn wxoa actived git J-btnSwitchLoginType" target="_Blank"
                           href="https://github.com/lcg0124/bootdo">
                            <em><i class="fa fa-github"></i></em>
                            <span>GitHub仓库</span>
                        </a>
                    </div>
                </div>-->

					</form>
				</div>
			</div>
			<!--<div class="signup-footer">
        <div class="pull-left">&copy; 2017 All Rights Reserved. AIpark
        </div>
    </div>-->
		</div>

		<div>
			<p style="color:#9fa1a7; position:absolute;bottom:4%;left:7%;">&copy; 2018 All Rights Reserved. AIpark</p>
			<img alt="image" style="position:absolute;bottom:4%;right:7%;" height="90" width="200" src="../static/img/logo.jpg" />
		</div>
		<!-- 全局js -->

		<script src="../static/js/jquery.min.js?v=2.1.4" th:src="@{/js/jquery.min.js?v=2.1.4}"></script>
		<script src="../static/js/bootstrap.min.js?v=3.3.6" th:src="@{/js/bootstrap.min.js?v=3.3.6}"></script>
		<script src="../static/js/public.js"></script>
		<script src="../static/js/hmac-sha256.js"></script>
		<script src="../static/js/enc-base64-min.js"></script>

		<!-- 自定义js -->
		<script src="../static/js/content.js?v=1.0.0" th:src="@{/js/content.js?v=1.0.0}"></script>

		<!-- jQuery Validation plugin javascript-->
		<script src="../static/js/jquery.min.js?v=2.1.4"></script>
		<script src="../static/js/vue.min.js"></script>
		<script src="../static/js/md5.js"></script>
		<script src="../static/js/bootstrap.min.js?v=3.3.6"></script>
		<script src="../static/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
		<script src="../static/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
		<script src="../static/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
		<script src="../static/js/plugins/validate/jquery.validate.min.js"></script>
		<script src="../static/js/plugins/validate/messages_zh.min.js"></script>
		<script src="../static/js/plugins/jsTree/jstree.min.js"></script>
		<script src="../static/js/plugins/jqTreeGrid/jquery.treegrid.min.js"></script>
		<script src="../static/js/plugins/jqTreeGrid/jquery.treegrid.extension.js"></script>
		<script src="../static/js/plugins/jqTreeGrid/jquery.treegrid.bootstrap3.js"></script>
		<script src="../static/js/plugins/chosen/chosen.jquery.js"></script>
		<script src="../static/js/plugins/layer/layer.js"></script>
		<script src="../static/js/content.js?v=1.0.0"></script>
		<script src="../static/js/public.js"></script>
		<!--summernote-->
		<script src="../static/js/plugins/summernote/summernote.js"></script>
		<script src="../static/js/plugins/summernote/summernote-zh-CN.min.js"></script>
		<script src="../static/js/ajax-util.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("#login").on('click', function() {
					$("#signupForm").submit();
				});
				validateRule();
			});
			$.validator.setDefaults({
				submitHandler: function() {
					login();
				}
			});

			function login() {
				$.ajax({
						type: "POST",
						url: API_SERVER_URL + "login",
						data: $('#signupForm').serialize(),
						success: function(r) {
							if(r.code == 0) {
								var index = layer.load(1, {
									shade: [0.1, '#fff'] //0.1透明度的白色背景
								});
								localStorage.clear();
								localStorage.setItem("token", JSON.stringify(r.token));
								//储存用户权限
								localStorage.setItem("permissions", JSON.stringify(r.permissions));
							//setCookie("token",r.token,30);
							//var token=getCookie("r.token");
							var token_1 = r.token;
							// Defining our token parts
							var header = {
								"alg": "HS256",
								"typ": "JWT"
							};
							var userId = r.userId;
							var data = {
								"userId": userId + '',
								"username": $('#username').val()
							};
							var username = $('#username').val();
							var pass = $('#password').val();
							var password = username + '1qazxsw2' + pass;
							var secrets = hex_md5(password);
							var secret = secrets.toUpperCase();
							var pass = $('#password').val();

							function base64url(source) {
								// Encode in classical base64
								encodedSource = CryptoJS.enc.Base64.stringify(source);

								// Remove padding equal characters
								encodedSource = encodedSource.replace(/=+$/, '');

								// Replace characters according to base64url specifications
								encodedSource = encodedSource.replace(/\+/g, '-');
								encodedSource = encodedSource.replace(/\//g, '_');

								return encodedSource;
							}

							var stringifiedHeader = CryptoJS.enc.Utf8.parse(JSON.stringify(header));
							var encodedHeader = base64url(stringifiedHeader);

							var stringifiedData = CryptoJS.enc.Utf8.parse(JSON.stringify(data));
							var encodedData = base64url(stringifiedData);

							var signature = encodedHeader + "." + encodedData;
							signature = CryptoJS.HmacSHA256(signature, secret);
							signature = base64url(signature);

							var JwtAuthorization = encodedHeader + '.' + encodedData + '.' + signature;
							localStorage.setItem("JwtAuthorization", JSON.stringify(JwtAuthorization));
							parent.location.href = '../templates/index_v1.html';
						} else {
							layer.msg(r.msg);
						}
					},
				});
			};

			function validateRule() {
				var icon = "<i class='fa fa-times-circle'></i> ";
				$("#signupForm").validate({
					rules: {
						username: {
							required: true
						},
						password: {
							required: true
						}
					},
					messages: {
						username: {
							required: icon + "请输入您的用户名",
						},
						password: {
							required: icon + "请输入您的密码",
						}
					}
				})
			}
		</script>
	</body>

</html>